<template>
  <div>
    <el-dialog :title="title" :visible.sync="open" width="500px">
      <el-row class="center-board-row" :gutter="formConf.gutter">
        <el-form
          :size="formConf.size"
          :label-position="formConf.labelPosition"
          :label-width="formConf.labelWidth + 'px'"
          v-loading="show"
        >
          <template-item
            v-for="(element, index) in drawingList"
            :key="element.renderKey"
            :drawing-list="drawingList"
            :element="element"
            :index="index"
            :active-id="activeId"
            :form-conf="formConf"
            :clearAttributes="clearAttributes"
            @activeItem="activeFormItem"
          />
        </el-form>
      </el-row>
      <view-verify
        :open.sync="open"
        :row="row"
        :taskId="taskId"
        :drawingList="drawingList"
        :id="id"
        :type="type"
      />
    </el-dialog>
  </div>
</template>

<script>
  import { getPage } from "@/views/UDform/js/page";
  import ViewVerify from "@/views/todoItem/Activiti/ViewVerify/index";
  import TemplateItem from "@/views/UDform/uiDIY/layoutFunction/templateList/TemplateItem.vue"
  import drawingDefalut from "@/utils/generator/drawingDefalut";
  import { formConf } from "@/utils/generator/config";


  export default {
    name: "transactForm",
    components: {
      ViewVerify,
      TemplateItem
    },
    props: {
      row: {
        type: Object,
      },
      pageId:{
        type: String,
      },
      taskId: {
        type: String,
      },
      taskName: {
        type: String,
      },
      type: {
        type: String,
        default: 'none',
      },
      taskList: {
        type: Array
      },
	    transactOpen:{
		    type:Boolean
	    },
      clearAttributes:{
        type:Number
      }

    },
    data() {
      return {
        show:true,
        title: '查看请假表单',
        form: this.row,
        pageData:{},
        open: false,
        id:'',
        drawingList: [],
        activeId: drawingDefalut[0].formId,
        activeData: drawingDefalut[0],
        formConf,
        // 请假类型字典
        typeOptions: [],
		    transactOpen2:false,
      }
    },
    created() {
      this.getDicts("biz_leave_type").then(response => {
        this.typeOptions = response.data;
      });
    },
    mounted(){
      // 按钮点击事件通过事件总线触发，同时接收pageId
      this.$EventBus.$on("getPageId",(res)=>{
		    let id = res;
		    this.id=id;
		    if(this.transactOpen2){
			    this.getPageData(this.id)
			    this.transactOpen2=false;
		    }
      })
    },
    methods:{
      // 对话框点击事件
      activeFormItem(element) {
        this.activeData = element;
        this.activeId = element.formId;
      },
      // 写入数据
      writeData(){
        console.log(this.form)
        console.log(this.drawingList)
        for (let key in this.form) {
          for (let i = 0; i < this.drawingList.length; i++) {
            if (this.drawingList[i].vModel == key) {
              this.drawingList[i].defaultValue = this.form[key]
            }
          }
        }
      },
      getPageData(id) {
        getPage(id).then((res)=>{
          if (res.code == 200) {
            console.log(res,"res");
            this.pageData = res.data;
            this.title='查看'+this.pageData.applicationName
            let webData = this.pageData.webPageCode
            if (webData != undefined) {
              this.webData = JSON.parse("[" + webData + "]");
              this.drawingList = this.webData;
            };
            this.writeData();
            this.drawingList = JSON.parse(JSON.stringify(this.drawingList));
            this.show = false
          }
        })
      }
    }
  }
</script>

<style scoped>
</style>
